<template>
  <div class="edit-box">
  <el-form label-width="120px" class="form-grid" :model="formData">
    <el-row :gutter="20">
      <el-col :span="24">
        <el-form-item label="头像"> <el-avatar :size="50" :src="$imageFull(formData.avatar)"></el-avatar> </el-form-item>
        <el-form-item label="用户ID"><el-input v-model="formData.id" readonly /></el-form-item>

        <el-form-item label="用户账号"><el-input v-model="formData.phone_number" readonly /></el-form-item>
        <el-form-item label="昵称"><el-input v-model="formData.nickname" readonly /></el-form-item>
        <el-form-item label="邻事币数量"><el-input v-model="formData.linshicoin_balance" readonly /></el-form-item>
        <el-form-item label="关注数"><el-input v-model="formData.follow_num" readonly /></el-form-item>

        <el-form-item label="注册时间"><el-input v-model="formData.create_time" readonly /></el-form-item>
        <el-form-item label="最后登录时间"><el-input v-model="formData.last_login_time" readonly /></el-form-item>
        <el-form-item label="状态">
          <el-switch v-model="formData.status" :active-value="1" :inactive-value="0"
            @change="handleStatusChange(formData.status)"></el-switch>
          <span class="action-status">{{ formData.status ? '启用' : '禁用' }}</span>
        </el-form-item>
      </el-col>


    </el-row>




  </el-form>
  </div>
</template>

<script>

export default {
  name: "ReviewDetail",
  props: {
    formData: {
      type: Object,
      required: true
    }
  },
  data() {
    return {

      remark: ""
    };
  },
  methods: {
     handleStatusChange(val){
      console.log('-------status---------',val)
      this.$emit('approve', { status: val, id:this.formData.id})

     }
  }
};
</script>

<style scoped>
  .action-status{
    padding-left: 20px;
  }
  .edit-box{
    box-sizing: border-box;
    padding: 10px 40px 20px 10px;
  }
.form-grid .el-form-item {
  margin-bottom: 20px;
}
.full-width{
  margin-top: 20px;
}
.full-width .el-input {

  width: 100%;
}
.btn-group {
  text-align: center;
}
</style>
